﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Wikipedia.aspx.cs" Inherits="Demos_Wikipedia" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">


    </style>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
    <script src="../Scripts/rx.js"></script>
    <script src="../Scripts/rx.time.js"></script>
    <script src="../Scripts/rx.jquery.js"></script>
    <script type="text/javascript">
        $(function () {
            var txtbox = $('#<%=TextBox1.ClientID%>');

            function queryWikipedia(term) {

                $.getJSONAsObservable('http://en.wikipedia.org/w/api.php?action=opensearch&search=' + term + '&limit=10&namespace=0&format=json&callback=?', {}).select(function (result) {
                    return result;
                }).subscribe(function (result) {
                    var ele = $('#result');
                    ele.empty();
                    $.each(result.data[1], function (k, v) {
                        ele.append($('<li/>').text(v));
                    });
                });

            }

            var searcher = txtbox.keyupAsObservable('keyup')
                .throttle(1000)
                .select(function (_) { return txtbox.val(); })
                .select(function (term) { return queryWikipedia(term); });

            searcher.subscribe(function (data) {
                //var result = $('#result');
                //result.empty();
                //$.each(data, function (k, v) {
                //    result.append($('<li/>').text(v));
                //});
            });

            

        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        </div>
        <ul id="result"></ul>
    </form>
</body>
</html>
